import { defineConfig, type UserConfigExport } from '@tarojs/cli';
import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
import devConfig from './dev';
import prodConfig from './prod';

// https://taro-docs.jd.com/docs/next/config#defineconfig-辅助函数
export default defineConfig<'webpack5'>(async (merge, { command, mode }) => {
  const baseConfig: UserConfigExport<'webpack5'> = {
    projectName: 'wineMiniProgram',
    date: '2025-6-23',
    designWidth: 375,
    deviceRatio: {
      640: 2.34 / 2,
      750: 1,
      375: 2,
      828: 1.81 / 2,
    },
    sourceRoot: 'src',
    outputRoot: 'dist',
    plugins: ['@taro-hooks/plugin-react'],
    defineConstants: {},
    copy: {
      patterns: [],
      options: {},
    },
    framework: 'react',
    compiler: 'webpack5',
    cache: {
      enable: false, // Webpack 持久化缓存配置，建议开启。默认配置请参考：https://docs.taro.zone/docs/config-detail#cache
    },
    mini: {
      sassLoaderOption: {
        implementation: require('sass'), // 强制使用 Dart Sass
        sassOptions: {
          quietDeps: true, // 静默第三方依赖的 deprecation
          // 拦截所有 deprecation 警告
          logger: {
            // warning 级别也一并静默，彻底看不到任何 Sass 警告
            warn: (message, options) => {},
            deprecation: (message, options) => {},
          },
        },
      },

      compiler: {
        type: 'webpack5',
        prebundle: {
          enable: false,
        },
      },
      postcss: {
        pxtransform: {
          enable: true,
          config: {
            selectorBlackList: ['no-rpx'],
          },
        },
        cssModules: {
          enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
          config: {
            namingPattern: 'module', // 转换模式，取值为 global/module
            generateScopedName: '[name]__[local]___[hash:base64:5]',
          },
        },
      },
      webpackChain(chain) {
        chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin);
        chain.plugin('miniCssExtractPlugin').tap((args) => {
          // args[0] 就是原 mini-css-extract-plugin 的配置对象
          args[0].ignoreOrder = true;
          return args;
        });
        chain.resolve.extensions.add('.ts').add('.tsx');
        chain.module
          .rule('typescript')
          .test(/\.(ts|tsx)$/)
          .exclude.add(/node_modules/)
          .end()
          .use('babel-loader')
          .loader('babel-loader')
          .tap((opts) => {
            // 如果你已经有 babel.config.js，这里可以只加 preset
            return {
              ...opts,
              presets: [
                // 保留原来的 preset-env/react，如果你配置了的话
                '@babel/preset-env',
                '@babel/preset-react',
                '@babel/preset-typescript',
              ],
            };
          });
        chain.merge({
          stats: {
            warningsFilter: [
              /legacy JS API is deprecated/,
              /Sass @import rules are deprecated/,
            ],
          },
        });
        chain.module
          .rule('scss')
          .use('sass-loader')
          .loader('sass-loader')
          .tap((opts) => ({
            implementation: require('sass'),
            sassOptions: { quietDeps: true },
          }));
      },
    },
    h5: {
      sassLoaderOption: {
        implementation: require('sass'), // 强制使用 Dart Sass
        sassOptions: {
          quietDeps: true, // 静默第三方依赖的 deprecation
          // 拦截所有 deprecation 警告
          logger: {
            // warning 级别也一并静默，彻底看不到任何 Sass 警告
            warn: (message, options) => {},
            deprecation: (message, options) => {},
          },
        },
      },
      compiler: {
        type: 'webpack5',
        prebundle: {
          enable: false, // 关闭预编译
        },
      },
      publicPath: '/',
      staticDirectory: 'static',
      miniCssExtractPluginOption: {
        ignoreOrder: true,
        filename: 'css/[name].[hash].css',
        chunkFilename: 'css/[name].[chunkhash].css',
      },
      postcss: {
        autoprefixer: {
          enable: true,
          config: {},
        },
        cssModules: {
          enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
          config: {
            namingPattern: 'module', // 转换模式，取值为 global/module
            generateScopedName: '[name]__[local]___[hash:base64:5]',
          },
        },
      },
      webpackChain(chain) {
        chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin);
        chain.plugin('miniCssExtractPlugin').tap((args) => {
          // args[0] 就是原 mini-css-extract-plugin 的配置对象
          args[0].ignoreOrder = true;
          return args;
        });
        chain.resolve.extensions.add('.ts').add('.tsx');
        chain.module
          .rule('typescript')
          .test(/\.(ts|tsx)$/)
          .exclude.add(/node_modules/)
          .end()
          .use('babel-loader')
          .loader('babel-loader')
          .tap((opts) => {
            // 如果你已经有 babel.config.js，这里可以只加 preset
            return {
              ...opts,
              presets: [
                // 保留原来的 preset-env/react，如果你配置了的话
                '@babel/preset-env',
                '@babel/preset-react',
                '@babel/preset-typescript',
              ],
            };
          });
        chain.merge({
          stats: {
            warningsFilter: [
              /legacy JS API is deprecated/,
              /Sass @import rules are deprecated/,
            ],
          },
        });
        chain.module
          .rule('scss')
          .use('sass-loader')
          .loader('sass-loader')
          .tap((opts) => ({
            implementation: require('sass'),
            sassOptions: { quietDeps: true },
          }));
      },
    },
    rn: {
      appName: 'taroDemo',
      postcss: {
        cssModules: {
          enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
        },
      },
    },
  };
  if (process.env.NODE_ENV === 'development') {
    // 本地开发构建配置（不混淆压缩）
    return merge({}, baseConfig, devConfig);
  }
  // 生产构建配置（默认开启压缩混淆等）
  return merge({}, baseConfig, prodConfig);
});
